import React from 'react'
import './top-center.less'

function TopCenter() {

    return <div className='top-center' style={{
        position: 'absolute',
        top: '0',
        display: 'flex',
        justifyContent: 'center',
        alignItems: 'center',
        zIndex: 99,
        width: '100%',
    }}>
        <div className='top-center-item'>
            <div className='top-center-img1' />
            <div className='top-center-text'>
                <div>水流速</div>
                <div><span className='top-center-number'>1.5</span> m/s</div>
            </div>
        </div>
        <div className='top-center-item'>
            <div className='top-center-img2' />
            <div className='top-center-text'>
                <div>水温</div>
                <div><span className='top-center-number'>20</span> ℃</div>
            </div>
        </div>
        <div className='top-center-item'>
            <div className='top-center-img3' />
            <div className='top-center-text'>
                <div>水深</div>
                <div><span className='top-center-number'>1.5</span> m</div>
            </div>
        </div>
    </div>
}

export default TopCenter;


